<template>
    <div class="bodyy">
        <el-collapse accordion v-model="activeName">
            <el-collapse-item name="1">
            <template slot="title" >
                <div class="title">
                    <img src="../../assets/title.png" alt="">
                    <span id="zqxx">证券信息</span>
                </div>
            </template>
            <div class="content">
                <el-descriptions :column="3"  border>
                    <el-descriptions-item label="A股代码" label-class-name="my-label" content-class-name="my-content">{{zqxx.ASTOCK_CODE}}</el-descriptions-item>
                    <el-descriptions-item label="证券类别" label-class-name="my-label" content-class-name="my-content" >{{zqxx.SEC_TYPE}}</el-descriptions-item>
                    <el-descriptions-item label="律师事务所" label-class-name="my-label" content-class-name="my-content">{{zqxx.LAW_FIRM_NAME}}</el-descriptions-item>
                    <el-descriptions-item label="A股简称" label-class-name="my-label" content-class-name="my-content">{{zqxx.ASTOCK_CN}}</el-descriptions-item>
                    <el-descriptions-item label="会计师事务所" label-class-name="my-label" content-class-name="my-content">{{zqxx.ACCOUNTING_FIRM_NAME}}</el-descriptions-item>
                </el-descriptions>
            </div>
            </el-collapse-item>
        </el-collapse>
    </div>
</template>

<script>
import { mapState } from 'vuex';
export default {
    name:'ZQXX',
    data(){
        return {
            activeName:'1'
        }
    },
    computed:{
        ...mapState({
            zqxx:state => state.stock.stockInfo['证券信息']
        })
    }
};
</script>

<style lang="less" scoped>
.bodyy {
    padding: 0 20px 20px 20px;
    background: #FFFFFF;
    border: 1px solid rgba(226,226,226,0.50);
    box-shadow: 0 4px 14px 0 rgba(209,225,242,0.46);
    border-radius: 2px;
    margin-top: 25px;
}
.title {
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    img {
        width: 30px;
        height: 30px;
    }
    span {
        font-size: 20px;
        margin-left: 12px;
    }
}
.content {
    width: 100%;
    // height: 264px;
    // border: 1px solid #E9ECF3;
    /deep/ .my-label {
        background: rgb(237,244,255);
        width: 10%;
    }
    /deep/ .my-content {
        font-family: PingFangSC-Regular;
        font-size: 14px;
        color: rgba(0,0,0,0.85);
        padding: 12px 25px;
        width: 20%;
    }
}
/deep/ .el-descriptions .is-bordered .el-descriptions-item__cell {
    border: 1px solid #E9ECF3;
}
//修改收缩框title的高度
/deep/ .el-collapse-item__header {
    height: 70px!important;
}
</style>